<template>
  <div>
    <Header :title="header_title" :img="header_img" :goback="goback" :right_text="right_text"></Header>
    <div class="topheader page">
      <div v-if="isempty == false" @click="changTab(item)" class="itembox disFlex" v-for="(item, index) in itemList" :key="index">
        <label for="" class="font28" v-if="index != 0">{{ item.name }}</label>
        <div v-else>
          <label for="" class="font28">{{ item.name }}</label>
          <img :src="help_img" alt="" style="margin-left:0.06rem">
        </div>
        <img :src="add_circle_img" alt="" v-if="index != 0">
        <van-switch v-model="checked" size="0.48rem" v-else @update:model-value="onUpdateValue" />
      </div>
      <div class="nodata" v-else>
          <img :src="nodata_img" alt="">
          <label for="" class="font28">空空如也，请创建简历</label>
          <van-button class="createBtn font32 fontWhite bgBlueFC" @click="gocreate">创建简历</van-button>
      </div>
    </div>
    <dialog-btn :title="'关闭职位推荐后，将不会根据您的实际情况推荐匹配岗位'" :show="delshow"></dialog-btn>

  </div>
</template>

<script>
import Header from '@/components/header.vue'
import DialogBtn from '@/components/dialogbtn.vue';
import { getCurrentInstance, reactive } from 'vue'
export default {
  components: {
    Header,
    DialogBtn
  },
  data() {
    return {
      header_title: '创建简历',
      header_img: require('@/assets/images/leftback_black.png'),
      right_text: '',
      nodata_img: require('@/assets/images/empty.png'),
      add_circle_img: require('@/assets/images/add-circle.png'),
      help_img: require('@/assets/images/help-circle.png'),
      itemList: [
        { name: '自动推荐岗位', to: '' },
        { name: '基本信息', to: '/info' },
        { name: '自我评价', to: '/selfassessment' },
        { name: '求职意向', to: '/intention' },
        { name: '工作经历', to: '/experience' },
        { name: '教育经历', to: '/education' },
        { name: '外语能力', to: '/language' },
        { name: '技能证书', to: '/certificate' },
      ],
      checked: true,
      delshow: false,
      api: '',
      token: '',
      isempty: true,
      idcard: this.$store.state.idCard
    }
  },
  mounted() {
    this.token = this.$store.state.token;
    this.api = getCurrentInstance().appContext.config.globalProperties.$http;
    var that = this;
    var data = {
      identityNumber: that.idcard
    }
    that.api.get('/personnel/h5/resumeInfo/queryOne', data).then(res => {
      var data = res.data;
      if (data.resumeInfo) {
        that.isempty = false;
        that.$router.replace('/myresume');
      } else {
        that.isempty = true;
      }
    })
  },
  methods: {
    // 跳转路由
    changTab(item) {
      this.$router.push(item.to);
    },
    onUpdateValue(e) {
      if (!e) {
        this.checked = !this.checked;
        this.delshow = true;
      }
    },
    ispopClose() {
      this.delshow = false;
    },
    ispopSub() {
      this.checked = !this.checked;
      this.delshow = false;
    },
    goback() {
      this.$router.replace('/home');
    },
    // 创建简历
    gocreate() {
      this.isempty = false;
    },
  }
}
</script>

<style scoped>
.itembox {
  border-bottom: 0.02rem solid #E8E9EC;
  height: 1.06rem;
}

.itembox img {
  width: 0.32rem;
  height: 0.32rem;
}

.page img {
  width: 0.32rem;
}
.nodata {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 1.6rem;
}
.nodata img {
  width: 3.2rem;
  height: 3.2rem;
}

.nodata label {
  color: #B3B5B9;
  margin: 0.48rem 0 .64rem 0;
}

.createBtn {
  border-radius: 0.48rem;
  width: 1.92rem;
  height: 0.72rem;
}
</style>